/*
 * modsAX Javascript Library
 * modsAX.com 2009 squall
 * update : modsTail.js V1.0
 * modsAX are licensed under a Creative Commons Attribution 3.0 license.
 * http://creativecommons.org/licenses/by/3.0/deed.ko
 * If you don't want to author Link
 * You must register. Join the modsAX license member then you free use modsAX
 * http://www.modsAX.com
 */

var modsTail = Class.create(modsAX, {
  version       : "modsTail V1.0",
  author        : "SQUALL",
  createDate    : "2010.03.31",
  lastModifyDate: "2010.04.26",
  initialize: function($super){
    $super();
    this.tails = [];
    this.config.input = {width:100};
    this.config.activeClass = "active";
    this.config.tailClass = "tailobj";
    this.config.tailAClass = "tailAobj";
    this.inputStatus = "RI"; // RI:ready input, EI:edit input
    this.coverA = "href=\"#modsExceptionScript\"";
  },
  /* ------------------------------------------------------------------------------------------------------------------ */
  /* init ~~~~~~ */
  init: function(){
    this.stage = jQuery("#"+this.config.tailStage);
    this.initInput();
    this.initModify();
  },
  initInput: function(){
    this.input = jQuery("<input type=\"text\" id=\""+this.config.tailStage+"_input\" class=\"modsTailInput\" />");
    this.input.css(this.config.input);
    this.stage.append(this.input);

    var onkeyup = this.onkeyup.bind(this);
    this.input.bind("keyup", onkeyup);

    var onTailClick = this.onTailClick.bind(this);
    this.stage.bind("click", onTailClick);
  },
  initModify: function(){
    this.modify = jQuery("<input type=\"text\" id=\""+this.config.tailStage+"_modify\" class=\"modsTailInput\" />");
    this.modify.css(this.config.input);

    var onkeyup2 = this.onkeyup2.bind(this);
    this.modify.bind("keyup", onkeyup2);

    var onblur2 = this.onblur2.bind(this);
    this.modify.bind("blur", onblur2);
  },
  setTails: function(tails){
    var tailStage = this.config.tailStage;
    var activeClass = this.config.activeClass;
    var tailClass = this.config.tailClass;
    var tailAClass = this.config.tailAClass;
    
    this.tails = tails;
    var po = [];
    jQuery.each(this.tails, function(i, n){
      po.push("<span class=\""+tailClass+"\" id=\""+tailStage+"_tail_"+i+"\"><a class=\""+tailAClass+"\">"+n+"</a>, </span>");
    });
    this.input.before(po.join(''));
  },
  onkeyup: function(event){
    if(event.keyCode == mods.Event.KEY_RETURN || event.keyCode == "188"){
      this.addTail(this.input.val());
      this.input.val("");
      event.stopPropagation();
      return;
    }
    if(event.keyCode == mods.Event.KEY_ESC){
      this.input.val("");
      return;
    }
  },
  onkeyup2: function(event){
    var myIndex = this.modify.data("index");
    if(event.keyCode == mods.Event.KEY_RETURN || event.keyCode == "188"){
      this.editTail(myIndex, this.modify.val());
      event.stopPropagation();
      return;
    }
    if(event.keyCode == mods.Event.KEY_ESC){
      this.editTail(myIndex);
      return;
    }
    if(event.keyCode == mods.Event.KEY_DELETE){
      this.removeTail(myIndex);
      return;
    }
  },
  onblur2: function(event){
    var myIndex = this.modify.data("index");
    var str = this.modify.val();
    if(str == ""){
      this.removeTail(myIndex);
    }else{
      this.editTail(myIndex, str);
    }
    return event;
  },
  addTail: function(str){
    var tailStage = this.config.tailStage;
    var activeClass = this.config.activeClass;
    var tailClass = this.config.tailClass;
    var tailAClass = this.config.tailAClass;
    if(str == "") return;
    str = str.replace(/,/g, "").delHtml();
    var obj = this.tails.getObj(function(n){
      return n == str;
    });
    if(!obj.obj){
      var newIndex = this.tails.length || 0;
      //alert(newIndex);
      var tail = jQuery("<span class=\""+tailClass+"\" id=\""+tailStage+"_tail_"+newIndex+"\"><a class=\""+tailAClass+"\">"+str+"</a>, </span>");
      this.input.before(tail);
      this.tails.push(str);
      jQuery("#"+tailStage+"_tail_"+newIndex).addClass(activeClass);
      setTimeout(function(){
      jQuery("#"+tailStage+"_tail_"+newIndex).removeClass(activeClass);
      }, 1000);
    }else{
      //alert(this.config.tailStage+"_tail_"+obj.index);
      jQuery("#"+tailStage+"_tail_"+obj.index).addClass(activeClass);
      setTimeout(function(){
      jQuery("#"+tailStage+"_tail_"+obj.index).removeClass(activeClass);
      }, 1000);
    }
  },
  onTailClick: function(event){
    if(!jQuery(event.target).hasClass(this.config.tailAClass)) return;
    var el = jQuery(event.target).parent();
    var elIDs = el[0].id.split("_");
    var modifyIndex = elIDs.last();
    el.find("a").css("display", "none");
    el.prepend(this.modify);
    this.modify.val(this.tails[modifyIndex]);
    this.modify.select();
    this.modify.data("index", modifyIndex);
  },
  editTail: function(index, str){
    var tailStage = this.config.tailStage;
    var activeClass = this.config.activeClass;
    if(!str){
      jQuery("#"+tailStage+"_tail_"+index).find("a").css("display", "");
      this.modify.detach();
      this.modify.data("index", "");  
      return;
    }
    str = str.replace(/,/g, "").delHtml();
    var obj = this.tails.getObj(function(n){
      return n == str;
    });
    if(!obj.obj || obj.index == index){
      jQuery("#"+tailStage+"_tail_"+index).find("a").css("display", "");
      this.tails[index] = str;
      jQuery("#"+tailStage+"_tail_"+index).find("a").html(str);
      this.modify.detach();
      this.modify.data("index", "");  
    }else{
      jQuery("#"+tailStage+"_tail_"+obj.index).addClass(activeClass);
      setTimeout(function(){
      jQuery("#"+tailStage+"_tail_"+obj.index).removeClass(activeClass);
      }, 1000);
    }
  },
  removeTail: function(index){
    this.modify.detach();
    this.modify.data("index", "");
    
    var tailStage = this.config.tailStage;
    var greps = this.tails.gets(function(n, i){
      jQuery("#"+tailStage+"_tail_"+i).remove();
      return i != index
    });
    this.setTails(greps);
  }
});